<template>
  <div>
    <el-image
      :src="imgUrl"
      @click="edit"
      style="width: 360px; height: 200px; border-radius: 10px"
      v-if="imgUrl"
    />
    <div v-else>
      <el-upload
        class="upload-demo"
        drag
        :headers="headers"
        :action="`${$apiHost}/img/fileImgUrl`"
        :on-success="onSuccess"
        accept=".jpg,.png,.jpeg"
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <!-- <div class="el-upload__tip" slot="tip">文件不超过{{ size }}MB</div> -->
      </el-upload>
    </div>
  </div>
</template>
<script>
export default {
  computed: {
    headers() {
      return {
        token: this.tokenv3 || window.$quinn.getStorage('tokenv3'),
      }
    },
  },
  data() {
    return {
      imgUrl: '',
    }
  },
  methods: {
    edit() {
      this.imgUrl = ''
    },
    onSuccess(e) {
      // console.log(e)
      this.imgUrl = 'https://' + e.result[0]
      this.$emit('url', e.result[0])
    },
  },
}
</script>
